<template>
  <div class="viewcontainer" v-if="dataset">
    <hi-toolbar :source="dataset" v-bind="toolbar"></hi-toolbar>
    <h2 class="viewcontainer_title">会员卡</h2>
    <hi-form
      ref="detailForm1"
      :model="dataset.curRecord"
      :dataSource="dataset"
      v-bind="form1"
    ></hi-form>
    <h2 class="viewcontainer_title">会员信息</h2>
    <hi-form
      ref="detailForm2"
      :model="dataset.curRecord"
      :dataSource="dataset"
      v-bind="form2"
    ></hi-form>
  </div>
</template>

<script>
import { HiForm, DataSetContainer, HiToolbar } from "hi-ui";
import viewBase from "../../base";
import datasetCfg from "./dataset";
export default {
  name: "vipdetail",
  extends: viewBase,
  components: {
    HiForm,
    HiToolbar,
  },

  data() {
    let dataset = null;
    return {
      //数据集配置
      datasetCfg: datasetCfg,

      //数据集
      dataset: dataset,
      toolbar: {
        buttons: [
          {
            kind: "save",
            //text: "保存",
            type: "danger",
            icon: "el-icon-upload",
          },
        ],
      },
      //数据桥梁
      dataBridge: new Map(),
      //编辑数据
      editData: {},
      //表单配置
      form1: {
        columnsTotal: 2,
        labelWidth: "180px",
        items: [
          {
            name: "FVIPCARD",
          },
          {
            name: "FUSERDESC",
          },
          {
            name: "FSENDCARDTIME",
          },
          {
            name: "FVIPGRADE",
            element: "hi-select-grid",
            props: {
              selectOption: {
                // remote:true,
                loading: true,
                multiple: false,
                clearable: true,
                filterable: true,
                "allow-create": true,
                "collapse-tags": true,
              },
              lookup: {
                modelFile: "grade/dataset/GradeEntity.xml",
                param: {},
                tableprops: {
                  // border:true,
                  //stripe:true,
                  "show-header": false,
                  //fit:false,
                  size: "mini",
                  "max-height": 400,
                },
                returnFields: {
                  FVIPGRADE: "FDESC",
                  FVIPGRADEID: "FID",
                },
                columns: [
                  {
                    name: "FDESC",
                    label: "等级名称",
                  },
                ],
              },
            },
          },
          {
            name: "FSTARTTIME",
          },
          {
            name: "FENDTIME",
          },
          {
            name: "FVIPSTATE",
            element: "el-select",
            props: {
              placeholder: "请选择",
            },
            children: [
              { element: "el-option", props: { value: true, label: "启用" } },
              { element: "el-option", props: { value: false, label: "禁用" } },
            ],
          },
        ],
      },
      form2: {
        columnsTotal: 2,
        labelWidth: "180px",
        items: [
          {
            name: "FVIPPHONE",
          },
          {
            name: "FVIPNAME",
          },
          {
            name: "FVIPSEX",
            element: "el-select",
            props: {
              placeholder: "请选择",
            },
            children: [
              { element: "el-option", props: { value: "男", label: "男" } },
              { element: "el-option", props: { value: "女", label: "女" } },
            ],
          },
          {
            name: "FVIPAGE",
          },
          {
            name: "FVIPBIRTHDAY",
          },
          {
            name: "FVIPIDNUMBER",
          },
          {
            name: "FREGIONID",
            element: "hi-cascader-tab",
            props: {
              lookup: {
                modelFile: "database/base/dataset/SqlBaseEntity.xml",
                param: { FPID: "szdq", $pageIndex: -1, $pageSize: -1 },
                id: "FID",
                pid: "FPID",
                pathLabels:"FREGION"
              },
              "show-all-levels": true,
              props: {
                value: "FVALUE",
                label: "FDESC",
                leaf: "FLEAF",
                lazy: true,
              },
            },
          },
          {
            name: "FDETAILADDRESS",
          },
          {
            name: "FWECHATNUMBER",
          },
          {
            name: "FQQNUMBER",
          },
          {
            name: "FNOTE",
            colspan: 2,
            props: {
              type: "textarea",
              autosize: {
                minRows: 4,
                maxRows: 4,
              },
              maxlength: 200,
            },
          },
        ],
      },
    };
  },
  model: {
    prop: "value",
    event: "valuechange",
  },
  props: {
    value: {
      type: Object,
    },
  },

  computed: {},
  watch: {},
  methods: {},
  mounted() {

    this.dataset = this.createDataSet(this.datasetCfg);
    // this.dataset = this.$dsContainer.createDataSet(this.datasetCfg);
    this.dataBridge.set(this.dataset, ["detailForm1", "detailForm2"]);
    if (this.$route.query.id) {
      this.dataset.load({
        FID: this.$route.query.id,
      });
    } else {
      this.dataset.add({});
      // this.dataset.on("aftersave", (item) => {
      //   this.dataset.load({
      //     FID: this.dataset.data[0].FID,
      //   });
      // });
    }
  },
};
</script>

<style rel="stylesheet/scss" lang="scss" scope>
.viewcontainer_title {
  font-size: 15px;
  line-height: 46px;
  font-weight: bold;
  padding: 0 20px;
}
</style>
